<template>
  <div class="city-filter">
    <ul class="letter-list">
      <li
      v-for="(item, key) in cities"
      :key="key">
        {{key}}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: 'Cfilter',
  props: {
    cities: Object
  },
  data() {
  	return {
  	};
  },
  methods: {

  }
};
</script>

<style lang="stylus" scoped>
  .city-filter
    position: fixed
    height: calc(100% - 1.58rem)
    top: 1.58rem
    right: .1rem
    .letter-list
      width: .4rem
      height: 100%
      display: flex
      -webkit-box-orient: vertical
      flex-direction: column
      justify-content: center
      li
        line-height: .4rem
        text-align: center
        color: #00bcd4
</style>
